<template>
    <div class="box">
        <top :navUrl="url"/>
        <ul>
            <li v-for="(item,index) in pdfurls" :key="index">
                <div class="fl">
                    <van-icon name="orders-o" />
                    <span>{{item.name}}</span>
                </div>
                <van-button icon="eye-o" size="mini" @click="viewClick(item.url)" type="primary">查看</van-button>
            </li>
        </ul>
    </div>
</template>
<script>
import top from '@/views/header.vue'
export default {
    name:'electronicOrder',
    data(){
        return{
            url:'/printDocuments',
            pdfurls:[],//'http://file.dakawengu.com/file/2018-05-29/20180527-tianfeng.pdf'
        }
    },
    created(){
        
        
        if (this.$route.params.id) {
            console.log(this.$route.params)
            this.createPDF(this.$route.params.id)
        }else{
            this.$router.push({ path: 'printDocuments' })
        }
        
    },
    methods:{
        // 获取车辆数据字典
        async createPDF(e) {
            let res = await this.$api.createPDF({
                orderId: e
            })
            console.log(res, '------------------- 获取车辆数据字典 ----------------')

            if (res.status === 200 && res.data.list) {
                res.data.list.forEach((el,index) =>{
                    console.log('index------------------',index)
                    if (index === 0) {
                        this.pdfurls.push({name:'机动车牌证申请表.pdf',url:el})
                    }else if (index === 1) {
                        this.pdfurls.push({name:'车辆检测委托单.pdf',url:el})
                    } else {
                        this.pdfurls.push({name:'收款收据.pdf',url:el})
                    }
                    
                })
                console.log('this.pdfurls-------------------',this.pdfurls)
            }
        },
        viewClick(url){
            console.log('url-----------',url)
            this.$router.push({
                name: 'pdf',
                params: {
                    url:url
                }
            })

        }        

    },
    components:{
        top
    }
}
</script>
<style lang="less" scoped>
    .box{
        ul{
            li{
                line-height: 0.8rem;
                display: flex;
                justify-content: space-between;
                padding:0.35rem 0.2rem;
                border-bottom: 1px dotted #ccc;
            }
        }
    }
</style>